<template>
  <div class="support">
    <div class="support-content">
      <div class="support-box">
        <h1>赞助 Avue.js 的研发</h1>
        <p>
          Avue.js 是采用 MIT 许可的开源项目，使用完全免费。 但是随着项目规模的增长，
          也需要有相应的资金支持才能持续项目的维护的开发。你可以通过下列的方法来赞助 Avue.js 的开发。
        </p>

      </div>
      <div class="support-box">
        <h2>捐赠</h2>
        <p>
          如果你是个人开发者并且享受 Avue 带来的高开发效率，
          可以用捐助来表示你的谢意 —— 就好像偶尔给我买杯咖啡 :)
        </p>
        <p>通过以扫描下方二维码捐赠(有钱的捧个钱场，没钱的捧个人场)</p>
        <img src="/images/zfb.png"
             style="margin:20px auto"
             width="300px"
             alt="">
        <img src="/images/wx.jpg"
             style="margin:20px auto"
             width="300px"
             alt="">
      </div>

      <div class="support-box">
        <h2>赞助商</h2>
        <p>如果你是企业经营者并且将 Avue 用在商业产品中，
          那么赞助 Avue 有商业上的益处：可以让你的产品所依赖的框架保持健康并得到积极的维护，
          也能帮助你在 Avue 社区里获得更高的曝光度，赞助商的 logo 或广告会出现在：</p>
        <br />
        <br />
        <ul>
          <li>本页面</li>
          <li>文档站首页</li>
          <li>Avue.js GitHub 仓库的和码云仓库 README 中</li>
        </ul>
        <p>想要成为赞助商请联系QQ：1547207846(备注赞助商)</p>
      </div>
    </div>
  </div>
</template>

<script>
export default {};
</script>

<style lang="scss">
.support {
  background-color: #fff;
  padding-top: 80px;
  &-content {
    position: relative;
    padding: 2.2em 20px;
    max-width: 600px;
    margin: 0 auto;
    background-color: #fff;
  }
  h1,
  h2 {
    margin: 0 0 1em;
  }
  p {
    margin-bottom: 30px;
    line-height: 25px;
  }
  ul {
    margin-bottom: 30px;
    line-height: 25px;
    padding-left: 20px;
  }
  &-box {
    margin-bottom: 90px;
  }
}
</style>
